<!--

/*
* Copyright (C) 2005-2013 University of Sydney
*
* Licensed under the GNU License, Version 3.0 (the "License"); you may not use this file except
* in compliance with the License. You may obtain a copy of the License at
*
* http://www.gnu.org/licenses/gpl-3.0.txt
*
* Unless required by applicable law or agreed to in writing, software distributed under the License
* is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
* or implied. See the License for the specific language governing permissions and limitations under
* the License.
*/

/**

* Allows editing of the title mask which constructs a one-line composite title for the record from fields within it
* Title mask structure modified late 2013 (~ Vsn 3.1.5) to use only internal codes within the stored mask, which are 
* translated to human-readable field names for editing, and vice versa
*
* @author      Artem Osmakov   <artem.osmakov@sydney.edu.au>
* @author      Ian Johnson   <ian.johnson@sydney.edu.au>
* @copyright   (C) 2005-2013 University of Sydney
* @link        http://Sydney.edu.au/Heurist
* @version     3.1.6
* @license     http://www.gnu.org/licenses/gpl-3.0.txt GNU License 3.0
* @package     Heurist academic knowledge management system
* @subpackage  
*/
-->

<html>
    <head>
        <title>Record Type Title Mask Edit</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <!-- yui layout -->
        <link rel="stylesheet" type="text/css" href="../../../external/yui/2.8.2r1/build/reset-fonts-grids/reset-fonts-grids.css">

        <!-- Skin CSS files resize.css must load before layout.css -->
        <link rel="stylesheet" type="text/css" href="../../../external/yui/2.8.2r1/build/assets/skins/sam/resize.css">
        <link rel="stylesheet" type="text/css" href="../../../external/yui/2.8.2r1/build/assets/skins/sam/layout.css">

        <!-- Utility Dependencies -->
        <script src="../../../external/yui/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js"></script>
        <script src="../../../external/yui/2.8.2r1/build/dragdrop/dragdrop-min.js"></script>
        <script src="../../../external/yui/2.8.2r1/build/element/element-min.js"></script>

        <!-- Optional Animation Support
        <script src="../../external/yui/2.8.2r1/build/animation/animation-min.js"></script> -->

        <!-- Optional Resize Support -->
        <script src="../../../external/yui/2.8.2r1/build/resize/resize-min.js"></script>

        <!-- Source file for the Layout Manager -->
        <script src="../../../external/yui/2.8.2r1/build/layout/layout-min.js"></script>
        
        <!-- TREEVIEW DEFS -->
        <!-- Required CSS -->
        <link type="text/css" rel="stylesheet" href="../../../external/yui/2.8.2r1/build/treeview/assets/skins/sam/treeview.css">

        <!-- Optional dependency source file -->
        <script type="text/javascript" src="../../../external/yui/2.8.2r1/build/animation/animation-min.js"></script>

        <!-- Optional dependency source file to decode contents of yuiConfig markup attribute-->
        <script type="text/javascript" src="../../../external/yui/2.8.2r1/build/json/json-min.js" ></script>

        <!-- TreeView source file -->
        <script type="text/javascript" src="../../../external/yui/2.8.2r1/build/treeview/treeview-min.js" ></script>

        <!-- END TREEVIEW DEFS-->
        <script type="text/javascript">
            var editRectypeTitle;
        </script>

        <style type="text/css">
            body {
                font: 10px Verdana, Geneva, sans-serif;
            }
        </style>
    </head>

    <body class="yui-skin-sam">
        <script type="text/javascript" src="../../../common/js/utilsLoad.js"></script>
        <script type="text/javascript" src="../../../common/js/utilsUI.js"></script>
        <script type="text/javascript" src="../../../admin/structure/rectypes/editRectypeTitle.js"></script>

        <div style="position:absolute;top:0px;bottom:0px;left:0px;width:202px;">
            <div align="left">
                &nbsp;<br>
                Select fields to insert
                <br>
                (add to record structure first)
                <br>&nbsp;<br>
            </div>
            
            <div style="position:absolute;top:50px;bottom:10px;left:0px;width:200px;overflow-y:scroll;">
                <div id="varsTree" class="ygtv-checkbox"></div>
            </div>
        </div>

        <div id="formContainer" style="position:absolute;top:0px;bottom:0px;left:202px;right:5px;">
            <div style="padding:10px;" align="left">
                The title mask builds a composite title from fields in the record (see manual).

                Field values identified by [ ] are inserted into the mask,

                e.g. <b>[Title], pp. [Start_Page]-[End_Page] </b> might generate:

                <b>"Alice in Wonderland, pp. 37-39" </b><br>&nbsp;<br>

                The element names in square brackets should match field names for this record type.<br>

                The constructed value is used as the extended title displayed in search results and other lists.<br>

                To insert a literal square-bracket, use two consecutive square-brackets ([[ or ]]).

                <br/>&nbsp;<br/>
            </div>

            <hr/>

            <div style="text-align:left; padding-top:20px;padding-bottom:1px;padding-left: 20px;" align="left">
                <b>Build Mask:</b> &nbsp;&nbsp;&nbsp; <button onclick="onInsert()" style="width:60px;">Insert fields</button>
                &nbsp;&nbsp;<i>Select fields in tree and click button to insert in mask at cursor position</i>
                <br/>&nbsp;<br/>
                <textarea cols="550" id="rty_TitleMask" rows="5" style="width:550px;"></textarea><br/>
                <br>
            </div>

            <!-- Artem: do not remove this - it is used for debug
            <div style="text-align:left; padding-top:10px; padding-left: 10px;display: none;" >
                Canonical Mask:&nbsp;

                <input maxlength="500" id="rty_CanonincalMask" style="width:350;"/> &nbsp;&nbsp;

                <button style="width:60px;" onclick="window.editRectypeTitle.doCanonical(2)">make canonic</button>

                <button style="width:60px;" onclick="window.editRectypeTitle.doCanonical(3)">make text</button>

                <br>&nbsp;<br>&nbsp;<br>
            </div>
            -->

            <hr/>

            <div style="padding-top:10px;padding-bottom:10px;padding-left: 20px;" align="left">
                <b>Test mask</b> <br>&nbsp;<br>

                <select id="listRecords" style="width:300px;"><option>select from records of this type (if any exist) ...</option></select>

                <br>&nbsp;<br><button onclick="onTest()" style="width:40px;">Test</button>

                <div id="testResult" title="Test result will appear here"  style="padding-left:40px; padding:5px; width: 400px; height: 10px; align: left"></div>
            </div>

            <hr/>

            <div style="padding-top:10px;padding-bottom:5px;padding-left: 20px;" align="left">
                <b>Save mask</b> <br>
                <br/><button style="width:60px;" onclick="onSave()">Save mask</button>&nbsp;&nbsp;
                <button style="width:60px;" onclick="window.close(null)">Cancel</button>
            </div>
        </div>

        <script type="text/javascript">
            function onInsert(){
                window.editRectypeTitle.doInsert();
            }

            function onTest(){
                window.editRectypeTitle.doTest();
            }
            
            function onSave() {
                window.editRectypeTitle.doSave();
            }

            //
            //  starts initialization on load completion of this window
            //
            function loadHandler(){
                window.editRectypeTitle = new EditRectypeTitle();
            }

            YAHOO.util.Event.addListener(window, "load", loadHandler );
        </script>
    </body>
</html>
